<!DOCTYPE html>
<html>
<body>
  <div id="root"></div>
</body>
<script src="./babel.min.js"></script>
<script src="./react.development.js"></script>
<script src="./react-dom.development.js"></script>

<script type="text/babel">
// 1. 创建组件
class Weather extends React.Component {
  constructor(props){
    super(props)
    this.state = {isHot: false, wind: "大风"}
  }
  // 想想调用的是谁
  hello(){
    console.log("内部标签被点击了")
  }

  render(){
    const {isHot} = this.state
    // 注意绑定事件的写法, 首先放大括号，其次方法名后不带（）
    return <h1 onClick={this.hello}>今天天气很{isHot ? "炎热" : "凉爽"}</h1>
  }
}
// 2. 渲染到页面
ReactDOM.render(<Weather />, document.getElementById('root'))

// 3. 测试方法
function hello(){
  console.log("标签被点击了")
}
</script>
</html>